<template>
	<view class="public-header">
		<view @click="goBack" class="padd_32 header clearfix" :class="{'dark' : dark}">
			<view class="fl">
				<image class="fl" :src="dark == true ? '/static/images/top_button_back_w@2x%20.png' : '/static/images/back.png'" mode="widthFix"></image>
			</view>
			{{title}}
			<view class="fr" v-show="share">
				<image src="/static/images/share.png" mode="widthFix"></image>
			</view>
			<view class="fr" v-show="search">
				<image src="/static/images/search.png" mode="widthFix"></image>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		options: {
		    addGlobalClass: true,
		  },
		props: {
			title: '',
			dark:false,
			share:false,
			search:false
		},
		methods: {
			goBack(){
				this.$Router.back();
			}
		}
	}
</script>

<style scoped lang="scss">
/* 导航 */
.header {
	height: 100rpx;
	width: 100%;
	background: #fff;
	line-height: 95rpx;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 100;
	font-size: 36rpx;
	color: #333;
	font-weight: 500;
	text-align: center;
}
.header image {
	margin-top: 26rpx;
	width: 38rpx;
	position: absolute;
}
.header .fr image{
	position: absolute;
	right: 32rpx;
}
.header .fl text {
	margin-left: 14rpx;
}
.header .tab{
	margin-left: 120rpx;
}
.header .tab text{
	text-align: center;
	display: inline-block;
	font-size: 32rpx;
	color: #666;
	position: relative;
}
.header .tab .tit{
	margin-right: 90rpx;
}
.header .tab .tit:last-child{
	margin-right: 0;
}
.header .tab .cur_sp{
	position: absolute;
}
.header .tab .cur{
	font-weight: 500;
	color: #333;
}
.header .tab .cur .cur_sp{
	width: 30rpx;
	height: 4rpx;
	background: $uni-color1;
	border-radius: 2rpx;
	right: 17rpx;
	bottom: 0;
}
.dark{
	background-color: $uni-color1;
	color: #fff;
}
</style>
